<template>
	<page-meta :page-style="$theme.pageStyle">
		<!-- #ifndef H5 -->
		<navigation-bar :front-color="$theme.navColor" :background-color="$theme.navBgColor" />
		<!-- #endif -->
	</page-meta>
	<view class="coupon-buy pt-1">
		<view class="item bg-white mx-[20rpx] my-[20rpx] px-4 py-4 btn-border flex flex-1 justify-between" @click="record">
			<view class="">领券记录</view>
			<u-icon name="arrow-right" color="#666"></u-icon>
		</view>
		
		<view v-if="formData.img" class="coupon-card box-border bg-white">
			<u-image style="flex:1;" :src="formData.img" height="340"></u-image>
			<!-- <u-image style="flex:1;" src="/static/images/a.png" height="340"></u-image> -->
		</view>
		
		
		<view class="pt-[60rpx] mx-[26rpx]">
			<u-button type="primary" shape="circle" @click="lingqu">立即领取</u-button>
		</view>
	</view>
</template>

<script lang="ts" setup>
import { ref, reactive } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { geTcj,geLqtcj } from '@/api/user';

const formData = ref<any>({});

const getData = async () => {
	formData.value = await geTcj();
	console.log(formData.value)
};

const lingqu = async () =>{
	try {
		const data = await geLqtcj();
		uni.$u.toast('领取成功');
		getData();
	} catch (e) {
		console.log('报错=>', e);
	}
}

const record = async() =>{
	uni.navigateTo({
		url:'/pages/necked/neck_record'
	})
}

onLoad((options: any) => {
	getData();
});
</script>

<style lang="scss">
.coupon-buy {
	height: 100%;

	.coupon-card {
		margin: 30rpx 20rpx;
		height: 300rpx;
	}
}
</style>

